<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>常见事件</title>
    <script>
        /**
         *
         1.点击事件：
         onclick:单击事件l
         double ：双击事件
         2.焦点事件：
         onblur:失去焦点
         一般用于表单校验
         onfocus:获得焦点  就好比光标在不在输入框里
         3.加载事件：
         onload:
         加载完成事件 可以用window

         4.鼠标事件:
         onmousedown
             定义形参 接收event对象的
         event对象的botton可以获取那个键被点击了
         onmouseup
         onmousemove
         onmouseover
         onmouseout
         5.键盘事件
         onkeyDown
         onkeyup
         onkeypress
         6.选择和改变
         onchange 域的内容被改变
         onselect 文本被选中
         7.表单事件
         onsubmit 确认按钮被点击 表单提交
         onreset  重填按钮被点击
         *

         */
        window.onload=function () {
            // var o1 = document.getElementById("username")
            // o1.onblur=function () {
            //     alert("失去焦点了")
            // }
            //
            // //鼠标移动到元素之上
            // document.getElementById("username").onmouseover=function () {
            //     alert("鼠标在此")
            // }
            // o1.getElementById("username").onmousedown=function (event) {
            //     //浏览器会给你传进来一个对象，这个对象可以操作一些属性
            //     alert(event.button)
            // }
            // document.getElementById("username").onkeydown=function (event) {
            //     //浏览器会给你传进来一个对象，这个对象可以操作一些属性
            //     if (event.keyCode==13) {
            //         alert("提交表单")
            //     }
            // }
            document.getElementById("city").onchange=function () {
                    alert("有改变")
            }



            // document.getElementById("form").onsubmit = function () {
            //     //校验用户名是否正确
            //     //阻止表单提交  方法如果  return false
            // }


            function checkForm() {
                return false
            }
        }

    </script>
</head>


<!--<form action="#" id="form" >-->
<form action="#" id="form" onclick=" return checkForm()">
<!--    看人家的方法，人家调用你这个 onclick="" 后面跟着的这个函数，这个函数是一个值 -->


<input id="username" name="username" type="text">


<select id="city" >
    <option>北京</option>
    <option>上海</option>
    <option>广州</option>
    <option>深圳</option>
</select>
<input type="submit" value="提交">


</form>




















</body>
</html>